HTMLify
style.css
Views: 15 | Author: cody
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 | .pagination-outer { text-align: center; } .pagination { background: linear-gradient(#e7f4fa, #d4e9f2); font-family: "Libre Franklin", sans-serif; padding: 5px; display: inline-flex; position: relative; } .pagination li a.page-link { color: #38339d; background: transparent; font-size: 18px; font-weight: 500; line-height: 35px; height: 35px; width: 30px; padding: 0; margin: 0 5px; border: none; overflow: hidden; position: relative; z-index: 1; transition: all 0.5s ease 0s; } .pagination li a.page-link:hover { color: #000; } .pagination li a.page-link:focus, .pagination li.active a.page-link:hover, .pagination li.active a.page-link { color: #000; background: transparent; font-weight: 700; border: none; } .pagination li:first-child a.page-link, .pagination li:last-child a.page-link { font-size: 15px; line-height: 37px; width: auto; padding: 0 8px; border-radius: 0; } .pagination li a.page-link:before { content: ""; background: #fff; width: 100%; height: 100%; border: 1px solid #38339d; border-radius: 5px; transform: scale(0); position: absolute; left: 0; top: 0; z-index: -1; transition: all 0.3s ease 0s; } .pagination li a.page-link:hover:before { transform: scale(1); } .pagination li a.page-link:focus:before, .pagination li.active a.page-link:hover:before, .pagination li.active a.page-link:before { transform: scale(0); } @media only screen and (max-width: 480px) { .pagination { font-size: 0; display: inline-block; } .pagination li { display: inline-block; vertical-align: top; margin: 0 0 10px; } } body { background-color: #16171e; } |